﻿var statuses = new Array( ) ;
var index = 0 ;
var oldChild = null ;

function onRequest( request ) {
    if( request.action == 'gotStatuses' ) {
      onPutForm( ) ;
      onText( request.statuses ) ;
    }
    if( request.action == 'gotRequestToken' ) {
      onPinForm( request.url ) ;
    }
    if( request.action == 'updatedStatus' ) {
      notifyUpdate( request.text ) ;
    }

}

function notifyUpdate( text ) {
  window.alert( 'post : ' + text ) ;
}

function onText( data ) {

    for( var i = 0; i < data.length; i++ ) {
      statuses[ i ] = data[ i ].user.name + ' : ' + data[ i ].text ;
    }
    display( ) ;

    startTimer( ) ;

}

function sendVerifier( verifier ) {
  chrome.extension.sendRequest( { 'action' : 'getAccessToken', 'verifier' : verifier }, onRequest ) ;
}

function onPinForm( url ) {

    var str = 'click here to get PIN ' ;

    var aTag    = document.createElement( 'a' ) ;
    aTag.href   = url ;
    aTag.target = '_blank' ;
    aTag.appendChild( document.createTextNode( str ) ) ;

    var input = document.createElement( 'input' ) ;
    input.type = 'text' ;
    input.size = '10' ;

    var button = document.createElement( 'input' ) ;
    button.type = 'button' ;
    button.value = 'submit' ;

    button.addEventListener( 'click', function( e ){ 
      sendVerifier( input.value ) ;
    }, true ) ;

    var timeline_dom = document.createElement( 'div' ) ;
    timeline_dom.appendChild( aTag ) ;
    timeline_dom.appendChild( input ) ;
    timeline_dom.appendChild( button ) ;
    timeline_dom.style.background = '#fff' ;
    timeline_dom.style.color      = '#fff' ;
    timeline_dom.style.padding    = '10px' ;
    timeline_dom.style.position   = 'relative' ;
    timeline_dom.style.zIndex     = '123456' ;
    timeline_dom.style.font       = '14px Arial' ;
    document.body.insertBefore( timeline_dom, document.body.firstChild ) ;

}

function onPutForm( ) {

    var input = document.createElement( 'input' ) ;
    input.type = 'text' ;
    input.size = '40' ;

    var button = document.createElement( 'input' ) ;
    button.type = 'button' ;
    button.value = 'post' ;

    button.addEventListener( 'click', function( e ){ 
      postMessage( input.value ) ;
    }, true ) ;

    var timeline_dom = document.createElement( 'div' ) ;
    timeline_dom.appendChild( input ) ;
    timeline_dom.appendChild( button ) ;
    timeline_dom.style.background = '#fff' ;
    timeline_dom.style.color      = '#fff' ;
    timeline_dom.style.padding    = '10px' ;
    timeline_dom.style.position   = 'relative' ;
    timeline_dom.style.zIndex     = '123456' ;
    timeline_dom.style.font       = '14px Arial' ;
    document.body.insertBefore( timeline_dom, document.body.firstChild ) ;

}

function postMessage( text ) {
  text += ' ' + location.href ;
  chrome.extension.sendRequest( { 'action' : 'postMessage', 'text' : text }, onRequest ) ;
}

function display( ) {

    var timeline_dom    = document.createElement('div') ;
    var text_dom        = document.createTextNode( statuses[ index ] ) ;
    timeline_dom.appendChild( text_dom ) ;
    timeline_dom.style.background = '#36b' ;
    timeline_dom.style.color      = '#fff' ;
    timeline_dom.style.padding    = '10px' ;
    timeline_dom.style.position   = 'relative' ;
    timeline_dom.style.zIndex     = '123456' ;
    timeline_dom.style.font       = '14px Arial' ;

    if( oldChild )
      document.body.removeChild( oldChild ) ;
    document.body.insertBefore( timeline_dom, document.body.firstChild ) ;
    oldChild = timeline_dom ;

    index++ ;
    if( index >= statuses.length )
      index = 0 ;

}

function startTimer( ) {
  setInterval( "display( )", 5000 ) ;
}

chrome.extension.sendRequest( { 'action' : 'url', 'url' : location.href }, onRequest ) ;
chrome.extension.sendRequest( { 'action' : 'timeline' }, onRequest ) ;
